<template>
	<view>
		<!-- <u-tabs :list="tabList" @click="click"></u-tabs> -->
<!-- 		<u-swiper :autoplay="false"
		    radius="5" style="margin: 20rpx;" :list="bannerList"></u-swiper> -->
		<u-row>
			<u-col span="2">
<!-- 				<view class="custom-style-parent">
					
				</view> -->
				<u--text :bold="true" customStyle="margin: 20rpx 0rpx 0rpx 50rpx" color="#666" text="等级"></u--text>
			</u-col>
			<u-col span="7">
				<u--text :bold="true" customStyle="margin: 20rpx 0rpx 0rpx 100rpx" color="#666" text="用户ID"></u--text>
			</u-col>
			<u-col span="3">
				<u--text :bold="true" customStyle="margin: 20rpx 0rpx 0rpx 50rpx" color="#666" text="总收益"></u--text>
			</u-col>
		</u-row>


		<u-list customStyle="margin: 30rpx 0rpx 0rpx 0" @scrolltolower="scrolltolower">
			<u-list-item v-for="(item, index) in indexList" :key="index">
				<u-row>
					<u-col span="2">
						<view class="custom-style-parent">
							<u--text customStyle="margin: 20rpx 0rpx 0rpx 30rpx" color="#333" :text="item.userLevel"></u--text>
						</view>
					</u-col>
					<u-col span="7">
						<view style="display: flex; flex-direction: row;">
							<u--image customStyle="margin: 0rpx 0rpx 0rpx 100rpx" :src="item.userHead" circle="true"
								width="50rpx" height="50rpx"></u--image>
							<u--text customStyle="margin: 0rpx 0rpx 0rpx 10rpx" color="#333" :text="getPhone(item.userPhone)"></u--text>
						</view>
					</u-col>
					<u-col span="3">
						<view class="custom-style-parent">
							<u--text :bold="true" customStyle="margin: 20rpx 0rpx 0rpx 00rpx" color="#000" :text="getMoney(item.allIncome)"></u--text>
						</view>
					</u-col>
				</u-row>
			</u-list-item>
		</u-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				bannerList: [
					'/static/bg_rank.png',
				],
				tabList: [{
					name: '佣金收入',
				}, {
					name: '提现支出',
				}],
				tabIndex:1,
				tabAddOrSub:'+',
				indexList: [],
			}
		},
		onLoad() {
			this.loadmore()
		},
		methods: {
			click(item) {
				console.log('item', item);
				this.tabIndex = item.index+1
				if(item.index == 1){
					this.tabAddOrSub = '+'
				}else {
					this.tabAddOrSub = '-'
				}
				
				this.loadmore()
			},
			scrolltolower() {
				this.loadmore()
			},
			loadmore() {
				let param = {
					pageNum: 1,
					pageSize: 200,
				}
				this.$u.api.apiMyTeam(param).then(res => {
					if (res.code == 1) {
						console.log("apiMyTeam",res.data)
						this.indexList = res.data.list
					}
				})
			},
			getMoney(moeny){
				if(this.tabIndex == 1){
					return '+'+moeny
				}else {
					return '-'+moeny
				}
			}
			,
			getPhone(phone){
				let str = phone.substring(0, 3)+"...."
				return str;
			}
		}
	}
</script>

<style>
	.custom-style-parent {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
</style>
